<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"/>
		<script src="js/jquery-2.1.1.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/bootstrap.min.js" type="text/javascript" charset="utf-8"></script>
	</head>
	<body>
		<!--响应式表格-->
		<div class="table-responsive">
			<!--表格 只需要修改table里的class即可-->
			<table class="table table-striped table-bordered table-hover  ">
				<thead>
					<tr class="active">
						<th>表格标题</th>
						<th>表格标题</th>
						<th>表格标题</th>
						<th>表格标题</th>
						<th>表格标题</th>
					</tr>
				</thead>
				<tbody>
					<tr class="info">
						<td>表格单元格表格单元格</td>
						<td>表格单元格表格单元格</td>
						<td>表格单元格表格单元格</td>
						<td>表格单元格表格单元格</td>
						<td>表格单元格表格单元格</td>
					</tr>
					<tr class="active">
						<td>表格单元格表格单元格</td>
						<td>表格单元格表格单元格</td>
						<td>表格单元格表格单元格</td>
						<td>表格单元格表格单元格</td>
						<td>表格单元格表格单元格</td>
					</tr>
					<tr class="warning">
						<td>表格单元格表格单元格</td>
						<td>表格单元格表格单元格</td>
						<td>表格单元格表格单元格</td>
						<td>表格单元格表格单元格</td>
						<td>表格单元格表格单元格</td>
					</tr>
					<tr class="danger">
						<td>表格单元格表格单元格</td>
						<td>表格单元格表格单元格</td>
						<td>表格单元格表格单元格</td>
						<td>表格单元格表格单元格</td>
						<td>表格单元格表格单元格2</td>
					</tr>
				</tbody>
			</table>
		</div>
	</body>
</html>
